import { TableColumn } from "../interface";
import { inject } from "vue";
export const useUtils = () => {
  const eventBus: any = inject("eventBus");
  /*/**
   * 鼠标按下事件
   * 父级的 transform可能导致鼠标位置偏移需要考虑
   * @param e
   * @param columnItem
   */
  const mouseDownHandler = (e: MouseEvent, columnItem: TableColumn) => {
    e.preventDefault();
    const parentNode: HTMLElement = e.target.parentNode;
    const target = e.target as HTMLElement;
    const top = parentNode.getBoundingClientRect().top;
    let startX = 0,
      endX = 0,
      dis = 0;
    startX = e.clientX;
    // parentNode.parentNode?.style?.setProperty("z-index", "1000");
    const adsorptionHandler = () => {
      target.style.cssText = `position: fixed;top: ${top}px;left: ${endX}px;z-index:20000;background:var(--el-color-primary);cursor:move;`;
    };
    const releaseHandler = () => {
      target.style.cssText = ``;
    };

    const moveHandler = (e: MouseEvent) => {
      endX = e.clientX;
      adsorptionHandler();
    };
    const upHandler = (e: MouseEvent) => {
      endX = e.clientX;
      dis = endX - startX;
      startX = endX;
      columnItem.width = parentNode.offsetWidth + dis >= 120 ? parentNode.offsetWidth + dis : 120;
      releaseHandler();
      eventBus.emit("fixedStyle");
      window.removeEventListener("mousemove", moveHandler);
      window.removeEventListener("mouseup", upHandler);
      // parentNode.parentNode?.style?.setProperty("z-index", "999");
    };

    window.addEventListener("mousemove", moveHandler);
    window.addEventListener("mouseup", upHandler);
  };

  // 防止文本选中时误触发点击事件
  const vPreventClickOnCopy = {
    mounted(el: any, binding: any) {
      const options = typeof binding.value === "function" ? { handler: binding.value } : binding.value || {};

      const { handler, preventDefault = true, stopPropagation = true, autoClear = true } = options;

      let isSelecting = false;
      let isMouseMoved = false;
      let startTime = 0;
      // 事件处理器
      const handleMouseDown = () => {
        startTime = new Date().getTime();
        isSelecting = false;
        isMouseMoved = false;
      };

      const handleMouseMove = () => {
        // 时间控制
        if (!isMouseMoved && new Date().getTime() - startTime > 200) {
          isMouseMoved = true;
          isSelecting = true;
        }
      };

      const handleMouseUp = () => {
        const hasSelection = window.getSelection().toString().length > 0;
        isSelecting = isMouseMoved || hasSelection;
      };

      const handleClick = (e: any) => {
        const hasSelection = window.getSelection().toString().length > 0;

        if (isSelecting || hasSelection) {
          if (preventDefault) e.preventDefault();
          if (stopPropagation) e.stopPropagation();
          if (autoClear) window.getSelection().removeAllRanges();
          return;
        }

        if (typeof handler === "function") handler(e);
      };

      // 保存处理器以便卸载时使用
      el._preventClickHandlers = {
        handleMouseDown,
        handleMouseMove,
        handleMouseUp,
        handleClick
      };

      // 绑定事件
      el.addEventListener("mousedown", handleMouseDown);
      el.addEventListener("mousemove", handleMouseMove);
      el.addEventListener("mouseup", handleMouseUp);
      el.addEventListener("click", handleClick);
    },

    unmounted(el) {
      // 清理事件监听
      if (el._preventClickHandlers) {
        const { handleMouseDown, handleMouseMove, handleMouseUp, handleClick } = el._preventClickHandlers;

        el.removeEventListener("mousedown", handleMouseDown);
        el.removeEventListener("mousemove", handleMouseMove);
        el.removeEventListener("mouseup", handleMouseUp);
        el.removeEventListener("click", handleClick);

        delete el._preventClickHandlers;
      }
    }
  };

  return {
    mouseDownHandler,
    vPreventClickOnCopy
  };
};
